<template>
  <div>
    <ul id="headnav-ul">
      <router-link to="/film/nowplaying" tag="li" activeClass="headNavActive" class="yahei-font" id="headnav-li">正在热映</router-link>
      <router-link to="/film/comingsoon" tag="li" activeClass="headNavActive" class="yahei-font" id="headnav-li">即将上演</router-link>
    </ul>
  </div>
</template>

<style lang="scss" scoped>
#headnav-ul{
    background: #fff;
    display: flex;
    list-style: none;
    justify-content: space-evenly;   //space-between
}
#headnav-li{
    height: 60px;
    text-align: center;
    line-height: 60px;
    font-size: 14px;
    width: 90px;
}
.headNavActive{
    color: #f39c12;
    border-bottom: 2px solid #f39c12;
}
</style>
